<template>
  <!-- 计算公式维护编辑 -->
  <base-breadcrumb :title="$route.meta.title">
    <a-form-model ref="ruleForm" :model="form" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" :rules="editModel == 0 ? {} : rules">
      <a-spin :spinning="loading" class="form-item">
        <!-- 表单 -->
        <a-card>
          <title-name title="计算公式维护"></title-name>
          <template v-if="code == 1001">
            <div>工期履约率 =[1－（工期滞后的天数-业主确认工期天数）/ 已施工天数]*100%</div>
            <div class="mt20">工期履约率得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" disabled v-model="form.aa" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 工期履约率 ＜</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="bb">
                    <BaseInputNumber :precision="2" v-model="form.bb" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="cc">
                    <BaseInputNumber :precision="2" v-model="form.cc" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="dd">
                    <BaseInputNumber :precision="2" v-model="form.dd" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span></a-form-model-item
                >
              </a-col>
              <a-col :md="24" :sm="24" style="margin-top: -20px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ee">
                    <BaseInputNumber :precision="2" v-model="form.ee" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 工期履约率 ＜</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ff">
                    <BaseInputNumber :precision="2" v-model="form.ff" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span><span>【工期履约率】</span> <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="gg">
                    <BaseInputNumber :precision="2" v-model="form.gg" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span class="ml20 mr20">-⌈（ </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="hh">
                    <BaseInputNumber :precision="2" v-model="form.hh" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">-【工期履约率】）*{{ form.ii }}⌉* </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ii"> <BaseInputNumber :precision="2" v-model="form.jj" style="width: 100px"> </BaseInputNumber> </a-form-model-item
                  ><span class="ml20 mr20">/</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="kk"> <BaseInputNumber :precision="2" v-model="form.kk" style="width: 100px"> </BaseInputNumber> </a-form-model-item
                ></a-form-model-item>
              </a-col>
              <a-col :md="24" :sm="24" style="margin-top: -20px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ll">
                    <BaseInputNumber :precision="2" v-model="form.ll" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 工期履约率 ≤</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="mm">
                    <BaseInputNumber :precision="2" v-model="form.mm" disabled style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span><span>【工期履约率】</span> <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="nn">
                    <BaseInputNumber :precision="2" v-model="form.nn" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item
              ></a-col>
            </a-row>
          </template>
          <template v-if="code == 1002">
            <div>合同外工期确认率 =业主确认工期天数/ 工期滞后的天数*100%</div>
            <div class="mt20">合同外工期确认率得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <span> 得分= </span><span class="ml20 mr20">【合同外工期确认率】*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" v-model="form.aa" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item></a-col
            ></a-row>
          </template>
          <template v-if="code == 1003">
            <div>产值完成率 =确权产值/计划产值*100%</div>
            <div class="mt20">产值完成率得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <span> 得分= </span><span class="ml20 mr20">【产值完成率】 *</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" v-model="form.aa" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item></a-col
            ></a-row>
          </template>
          <template v-if="code == 1004">
            <div>人均产值 =确权产值/人数</div>
            <div class="mt20">人均产值得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <span> 得分= </span><span class="ml20 mr20">【人均产值】 /</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa"> <BaseInputNumber :precision="2" v-model="form.aa" style="width: 100px"> </BaseInputNumber> </a-form-model-item
                  ><span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="bb">
                    <BaseInputNumber :precision="2" v-model="form.bb" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item></a-col
            ></a-row>
          </template>
          <template v-if="code == 1005">
            <div>节点按时完成率 =按时完成节点数/计划完成节点数*100%</div>
            <div class="mt20">节点按时完成率得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" disabled v-model="form.aa" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 节点按时完成率 ＜</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="bb">
                    <BaseInputNumber :precision="2" v-model="form.bb" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="cc">
                    <BaseInputNumber :precision="2" v-model="form.cc" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="dd">
                    <BaseInputNumber :precision="2" v-model="form.dd" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span></a-form-model-item
                >
              </a-col>
              <a-col :md="24" :sm="24" style="margin-top: -20px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ee">
                    <BaseInputNumber :precision="2" v-model="form.ee" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 节点按时完成率 ＜</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ff">
                    <BaseInputNumber :precision="2" v-model="form.ff" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span><span>【节点按时完成率】</span> <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="gg">
                    <BaseInputNumber :precision="2" v-model="form.gg" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span class="ml20 mr20">-⌈（ </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="hh">
                    <BaseInputNumber :precision="2" v-model="form.hh" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">-【工期履约率】）*{{ form.ii }}⌉ </span>
                </a-form-model-item>
              </a-col>
              <a-col :md="24" :sm="24" style="margin-top: -20px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="jj">
                    <BaseInputNumber :precision="2" v-model="form.jj" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 节点按时完成率 ≤ </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="kk">
                    <BaseInputNumber :precision="2" v-model="form.kk" disabled style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span><span>【节点按时完成率】</span> <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ll">
                    <BaseInputNumber :precision="2" v-model="form.ll" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item
              ></a-col>
            </a-row>
          </template>
          <template v-if="code == 1006">
            <div class="mt20">实名制出勤率得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" disabled v-model="form.aa" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 实名制出勤率 ＜</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="bb">
                    <BaseInputNumber :precision="2" v-model="form.bb" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="cc">
                    <BaseInputNumber :precision="2" v-model="form.cc" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="dd">
                    <BaseInputNumber :precision="2" v-model="form.dd" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span></a-form-model-item
                >
              </a-col>
              <a-col :md="24" :sm="24" style="margin-top: -20px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ee">
                    <BaseInputNumber :precision="2" v-model="form.ee" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 实名制出勤率 ＜</span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ff">
                    <BaseInputNumber :precision="2" v-model="form.ff" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span><span>【实名制出勤率】</span> <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="gg">
                    <BaseInputNumber :precision="2" v-model="form.gg" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span class="ml20 mr20">-⌈（ </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="hh">
                    <BaseInputNumber :precision="2" v-model="form.hh" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">-【实名制出勤率】）*{{ form.ii }}⌉* </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ii"> <BaseInputNumber :precision="2" v-model="form.jj" style="width: 100px"> </BaseInputNumber> </a-form-model-item
                ></a-form-model-item>
              </a-col>
              <a-col :md="24" :sm="24" style="margin-top: -20px">
                <a-form-model-item>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="kk">
                    <BaseInputNumber :precision="2" v-model="form.kk" style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">≤ 实名制出勤率 ≤ </span>
                  <a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="ll">
                    <BaseInputNumber :precision="2" v-model="form.ll" disabled style="width: 100px"> </BaseInputNumber>
                  </a-form-model-item>
                  <span> % </span><span class="ml20 mr20">得分=</span><span>【实名制出勤率】</span> <span class="ml20 mr20">*</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="mm">
                    <BaseInputNumber :precision="2" v-model="form.mm" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item
              ></a-col>
            </a-row>
          </template>
          <template v-if="code == 1007">
            <div>顾客满意度取本年度一月至所在“月份”内的满意度数据的平均数</div>
            <div class="mt20">顾客满意度得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <span> 得分= </span><span class="ml20 mr20">【顾客满意度】 /</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" v-model="form.aa" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item></a-col
            ></a-row>
          </template>
          <template v-if="code == 1008">
            <div class="mt20">投诉得分计算公式：</div>
            <a-row :gutter="24">
              <a-col :md="24" :sm="24" style="margin-top: 10px">
                <a-form-model-item>
                  <span> 得分= </span><span class="ml20 mr20">【顾客满意度】 *</span
                  ><a-form-model-item :style="{ display: 'inline-block' }" :colon="false" prop="aa">
                    <BaseInputNumber :precision="2" v-model="form.aa" style="width: 100px"> </BaseInputNumber> </a-form-model-item></a-form-model-item></a-col
            ></a-row>
          </template>
        </a-card>
        <!-- 页脚操作栏 -->
        <div class="btn_box page-btn-right-top">
          <a-button v-if="editModel != 0" class="button_right" type="primary" :loading="loadingBtn.SUBMITTED" @click="handleSubmit('SUBMITTED')">提交</a-button>
          <a-button @click="handleActiveClose">关闭</a-button>
        </div>
      </a-spin>
    </a-form-model>
  </base-breadcrumb>
</template>

<script>
import { api } from '@/api/project/performanceAnalysis'
import BaseEditPage from '@/views/baseEditPage' // 编辑详情页基础配置
import BSelect from '@/components/BComponents/BSelect'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 分公司

export default {
  name: 'projectAuthorizationLetter',
  extends: new BaseEditPage(),
  components: {
    SelectProject,
    BSelect,
    SelectSubCompany
  },

  data() {
    return {
      loading: false, // 加载控件
      editModel: 1, // 操作状态:0 查看;1 编辑
      form: {}, // 表单
      id: '',
      loadingBtn: {
        DELETE: false,
        DRAFT: false,
        SUBMITTED: false,
        REJECTED: false
      },

      rules: {
        aa: [{ required: true, message: '请输入' }],
        bb: [{ required: true, message: '请输入' }],
        cc: [{ required: true, message: '请输入' }],
        dd: [{ required: true, message: '请输入' }],
        ee: [{ required: true, message: '请输入' }],
        ff: [{ required: true, message: '请输入' }],
        gg: [{ required: true, message: '请输入' }],
        hh: [{ required: true, message: '请输入' }],
        ii: [{ required: true, message: '请输入' }],
        jj: [{ required: true, message: '请输入' }],
        kk: [{ required: true, message: '请输入' }],
        ll: [{ required: true, message: '请输入' }],
        mm: [{ required: true, message: '请输入' }],
        nn: [{ required: true, message: '请输入' }]
      }, // 校验规则
      init: false // 初始化控件
    }
  },

  mounted() {
    // 不为添加时请求详情
    this.getDetailData()
  },

  methods: {
    getDetailData() {
      this.loading = true
      api
        .getCalculateFormula({ id: this.id })
        .then((res) => {
          this.loading = false
          this.form = res.data
          console.log(this.form)
          this.$refs.table.refresh()
          this.$nextTick(() => {
            this.init = true
          })
        })
        .catch(() => {
          this.loading = false
        })
    },
    validateForm() {
      let flag1 = true

      this.$refs.ruleForm.validate((e) => {
        flag1 = e
      })

      return flag1
    },
    /**
     * 提交表单
     */
    handleSubmit(status) {
      if (!this.validateForm()) {
          this.$message.warning("请填写完所有必填项信息")
        return
      }
      let form = this.$clone(this.form)
      this.loading = true
      api
        .updateCalculateFormula(form)
        .then(() => {
          this.loading = false
          this.$message.success(status == 'SUBMITTED' ? '提交成功！' : '保存成功')
          this.$multiTab.close()
        })
        .catch(() => {
          this.loading = false
          this.$message.warning(err.data.message)
        })
    }
  }
}
</script>
<style lang="less" scoped>
.flex-row {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}

/deep/ .form-item  {
  .ant-input:not([disabled]),
  .ant-select:not(.ant-select-disabled) .ant-select-selection,
  .ant-calendar-picker-input,
  .ant-input-number:not([disabled]),
  .ant-cascader-picker {
    border-color: #e4ac0b;
    background-color: #fff9e8;
  }
  .ant-input-disabled,
  .ant-input-number-disabled .ant-input-number-input,
  .ant-time-picker-input[disabled] {
    border-color: #d9d9d9 !important;
    background-color: #f5f5f5 !important;
  }
  .ant-form-item .ant-form-item-control-wrapper {
    width: auto;
  }
  .remark {
    .ant-input {
      border-color: inherit;
      background-color: initial;
      width: 100px;
    }
  }
}
</style>
